<template>
  <div class='index'>
    <div class="header-nav">
      <div class="header-logo">

        <a class="header-logo-pic">
          <h1>元宝铺，数据贷动未来</h1>
        </a>
      </div>
      <div class="header-menu">

        <div class="header-menu-item active">
          <a href="https://www.facebook.com/sharer.php?title=胸口&u=https://www.yuanbaopu.com"
             target="_blank">Facebook</a>
        </div>
        <div id="yiyi" class="header-menu-item">
          <a class="header-title site_data_service click-report-log" href="/creditEngine.html">数贷引擎FIDE</a>
        </div>
        <div class="header-menu-item">
          <a class="header-title site_product click-report-log" href="/trustPoint.html">信易点</a>
        </div>
        <div class="header-menu-item">
          <a class="header-title site_vip click-report-log" href="/windControl.html">烽控</a>
        </div>
        <div class="header-menu-item">
          <a class="header-title site_data_point click-report-log" href="/creditProduct.html">信贷产品解决方案</a>
        </div>
      </div>
    </div>

    <div class="pc-show">
      <div class="swiper-container">
        <div class="swiper-wrapper" style="height: 200px;">
          <div class="swiper-slide">Slide 1</div>
          <div class="swiper-slide">Slide 2</div>
          <div class="swiper-slide">Slide 3</div>
        </div>
        <!-- 如果需要分页器 -->
        <div class="swiper-pagination"></div>

        <!-- 如果需要导航按钮 -->
        <div class="swiper-button-prev"></div>
        <div class="swiper-button-next"></div>

        <!-- 如果需要滚动条 -->
        <div class="swiper-scrollbar"></div>
      </div>
    </div>

    <div class="mobile-show">
      <div>手机显示</div>

    </div>

  </div>
</template>
<script>

import {mapGetters, mapActions} from 'vuex';
import Swiper from 'swiper';
import util from '../../utils/utils';
// import 'swiper/dist/css/swiper.css';


export default {
  name: 'index',
  computed: {
    ...mapGetters(['count'])
  },
  methods: {
    ...mapActions([
      'addCount'
    ]),
    add() {
      this.addCount({num: 10});
    }
  },
  mounted: function () {
    new Swiper('.swiper-container', {
      autoplay: true,
      loop: true
    });

    window.$('.swiper-container').click(function () {
      alert();
    });

    console.log(util);
  }

};
</script>
<style lang="scss">
  .index {
    position: relative;
    font-size: 24px;
    color: $titleColor;
    .count {
      text-align: center;
    }
    img {
      position: relative;
      margin-top: 60px;
      left: 50%;
      transform: translateX(-50%)
    }

  }
</style>
